<template>
	<view class='qrcode'>
		<image :src="qrcodeURL" @click='previewImage' style="margin:0 auto;"
			:style="[{'width':width+'rpx','height':width+'rpx'}]"></image>
		<slot name="text"></slot>
	</view>
</template>

<script>
	import QR from './weapp-qrcode.js'
	const rpx2px = wx.getSystemInfoSync().windowWidth / 750
	export default {
		name: "hxt-qrcode",
		options: {
			styleIsolation: 'apply-shared'
		},
		props: {
			value: {
				type: String,
				default: ''
			},
			width:{
				type: String,
				default: ''
			},
		},
		data() {
			return {
				qrcodeURL: ''
			};
		},
		onReady: function(e) {
			var imgData = QR.drawImg(this.value, {
				typeNumber: 3, //码点大小 1-40，数字越大，码点越小，二维码会显得越密集
				errorCorrectLevel: 'H', //纠错等级 H等级最高(30%) 简单来说，就是二维码被覆盖了多少仍然能被识别出来 详见qrcode.js
				size: parseInt(rpx2px * this.width)
			})
			this.setData({
				qrcodeURL: imgData
			})
		},
		methods: {
			previewImage: function() {
				var _this=this;
				wx.previewImage({
				  current: _this.qrcodeURL, // 当前显示图片的 http 链接
				  urls: [_this.qrcodeURL] // 需要预览的图片 http 链接列表
				})
				return;
				var self = this
				var aa = wx.getFileSystemManager(),
					filePath = wx.env.USER_DATA_PATH + '/qrcode_' + self.value + '.png';
				//写入临时文件
				aa.writeFile({
					filePath: filePath,
					data: self.qrcodeURL.slice(22),
					encoding: 'base64',
					success: res => {
						//保存临时文件到手机相册中去
						wx.saveImageToPhotosAlbum({
							filePath: filePath,
							success: function(res) {
								wx.showToast({
									title: '保存成功',
								})
							},
							fail: function(err) {
								console.log(err)
							}
						})
						console.log(res)
					},
					fail: err => {
						console.log(err)
					}
				})
			}
		}
	}
</script>

<style>

</style>
